<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<base href="http://1stjs.googlecode.com/svn/trunk/fw4/" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link href="data/img/slides/icon/base.css" rel="stylesheet">
<link href="data/img/slides/icon/doc.css" rel="stylesheet">
<script type="text/javascript" src="1st.js"></script>
</head>

<body style="background-color:#fff;">
<h3>工具展示幻灯片示例</h3>
<style>
#sbox07{border:1px solid #ccc;float:left;text-align:center; margin:10px;}
#sbox07 .panel{position:relative;width:136px;height:324px;overflow:hidden;}
#sbox07 .panel div{padding:2px;}
#sbox07 .panel img{border:1px solid #999;display:block;width:130px;height:102px;}
#sbox07 .prev{cursor:pointer;}
#sbox07 .next{cursor:pointer;}
</style>
<div id="sbox07">
	<div class="panel">
		<div><img src="data/img/slides/icon/lp1.jpg"/></div>
		<div><img src="data/img/slides/icon/lp2.jpg"/></div>	
		<div><img src="data/img/slides/icon/lp3.jpg"/></div>
		<div><img src="data/img/slides/icon/lp4.jpg"/></div>
		<div><img src="data/img/slides/icon/lp5.jpg"/></div>
		<div><img src="data/img/slides/icon/lp6.jpg"/></div>	
		<div><img src="data/img/slides/icon/lp7.jpg"/></div>
		<div><img src="data/img/slides/icon/lp8.jpg"/></div>
	</div>
	<span class="prev">上一页</span>&nbsp;&nbsp;
	<span class="next">下一页</span>
</div>

<script type="text/javascript">
F("sbox07").slides({
	init: function(me){
		me.next.click(function(){
			me.oldIndex==me.count-1 && alert("已经到达尾部");
		});
	},
	panel: "scrollTop",	
	increment: 108,
	duration:250,
	loop: 0
});
</script>
</body>
</html>
